<!DOCTYPE html>
{% load staticfiles %}
<html>
	<head>
		<meta charset="UTF-8">
		<title>素材上傳</title>
		<link rel="shortcut icon" href="{% static 'img/logo/logo_s.ico' %}" />
        <link href="{% static 'bootstrap-3.3.7-dist/css/bootstrap.min.css' %}" rel="stylesheet" />
		<link rel="stylesheet" href="{% static 'css/index.css' %}" />
		<link rel="stylesheet" href="{% static 'css/webuploader.css' %}" />
		<link rel="stylesheet" href="{% static 'css/style.css' %}" />
		<link rel="stylesheet" href="{% static 'bootstrap-fileinput-master/css/fileinput.css' %}"/>
		<style>
			.demo{min-width:360px;margin:0px auto;padding:0px 20px}
			.demo h3{font-weight: bold;margin-top: 10px;text-align: center;}
			.file-item{float: left; position: relative; width: 110px;height: 110px; margin: 0 20px 20px 0; padding: 4px;}
			.file-item .info{overflow: hidden;}
			.uploader-list{width: 100%; overflow: hidden;}
			
			.form-control{
				color: #000000;
			}
			.span_show li{
				list-style: none;
				float: left;
				margin: 8px 6px;
			}
			.span_show a{
				text-decoration: none;
				color: #2EE679;
				border: 1px solid #2EE679;
				padding: 5px;
			}
			#fodder_style{
				color: #999999;
			}
			#fodder_style option{
				color: #555555;
			}
			.kv-file-upload{
				display: none;
			}
			.btn-file{
				padding: 4px;
			}
		</style>
	</head>
	<body>
		<div class="navigation container" style="background-color: #617C8D;width: 100%;padding: 0px;">
			<div class=" row col-md-12 col-sm-12 col-xs-12">
				<div class="col-md-2 col-sm-3 col-xs-12" style="text-align: center;">
					<img src="{% static 'img/logo/LOGO2.png' %}" style="height: 60px;">
				</div>
				<div class="col-md-8 col-sm-9 col-xs-12" style="margin-top: 10px; padding: 0px;">
					<ul class="col-md-12 col-sm-12 col-xs-12" style="margin: 10px 0;">
						<li class="col-md-2"><a href="/">首頁</a></li>
						<li class="col-md-2"><a href="/ml/hd_pictures/?type=高清圖片">高清圖片</a></li>
						<li class="col-md-2"><a href="/ml/hd_pictures/?type=logo">logo</a></li>
						<li class="col-md-2"><a href="/ml/hd_pictures/?type=矢量圖標">矢量圖標</a></li>
						<li class="col-md-2"><a href="/ml/hd_pictures/?type=PSD素材">PSD素材</a></li>
						<li class="col-md-2"><a href="/ml/hd_pictures/?type=3D模型">3D模型</a></li>
						<!--<li class="col-md-2"><a href="#">更多…</a></li>-->
					</ul>
				</div>
				<div class="col-md-2 col-sm-12 nav_left" style="padding: 8px 0;">
					<div class="col-md-4 col-sm-3">
						<ul style="padding: 0px;">
							<li style="margin-right: 15px;"><a href="/ml/file_upload/"><span><img src="{% static 'img/cloud_uploda.png' %}" style="height: 18px;"/></span></a></li>
							<!--<li> <a href="#">換膚&nbsp;<span><img src="img/arrow_down.png" style="height: 16px;" /></span></a></li>-->
							<!--<li> <a href="#">換膚&nbsp;<span class="glyphicon glyphicon-menu-down"></span></a></li>-->
						</ul>
					</div>
					<div class="col-md-8 col-sm-3">
						<ul style="padding: 0px;width: 150px;">

                                {% if login_status == False %}
                                    <li class="login" data-toggle="modal" data-target="#login_modal">
                                        <a href="#">登錄</a>
                                    </li>
                                {% else %}
                                    <li class="login">
                                        <a href="">{{ user }}</a>
                                    </li>
                                {% endif %}
							<li>|</li>
                                {% if login_status == False %}
                                    <li class="register" data-toggle="modal">
                                        <a>註冊</a>
                                    </li>
                                {% else %}
                                    <li class="register">
                                        <a href="/ml/userLogout/">注销</a>
                                    </li>
                                {% endif %}
						</ul>
					</div>
				</div>
			</div>
		</div>
		
		
		<!--用户登录-->
		<div class="modal fade" id="login_modal" tabindex="-1" role="dialog" aria-labelledby="loginModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-ohidden="true">&times;</button>
						<h4>登錄</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal" role="form">
							<div class="form-group">
								<label class="col-md-2 control-label">賬號</label>
								<div class="col-md-9">
									<input type="text" class="form-control" id="login_account" placeholder="請輸入工號" />
								</div>
							</div>
							<div class="form-group">
								<label class="col-md-2 control-label">密碼</label>
								<div class="col-md-9">
									<input type="password" class="form-control" id="login_password" placeholder="請輸入密碼" />
								</div>
							</div>
							<div class="form-group">
								<div class="col-md-offset-2 col-md-9">
									<div class="checkbox">
										<label>
											<input type="checkbox" />請記住我
										</label>
									</div>
								</div>
							</div>
						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">關閉</button>
						<button type="button" class="btn btn-primary">登錄</button>
					</div>
				</div>
			</div>
		</div>
		
		<!--用户注册-->
		<div class="modal fade" id="register_modal" tabindex="-1" role="dialog" aria-labelledby="loginModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-ohidden="true">&times;</button>
						<h4>註冊</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal" role="form">
							<div class="form-group">
								<label class="col-md-2 control-label">賬號</label>
								<div class="col-md-9">
									<input type="text" class="form-control" id="register_account" onblur="check_workid()" placeholder="請輸入您的工號" />
									<div id="workid_error" class="register_error" style="display: none;height: 10px;color: red;"></div>
								</div>
							</div>
							<div class="form-group">
								<label class="col-md-2 control-label">密碼</label>
								<div class="col-md-9">
									<input type="password" class="form-control" id="register_password1" onblur="check_pwd1()" placeholder="請輸入您的密碼" />
									<div id="pwd1_error" class="register_error" style="display: none; height: 10px; color: red;"></div>
								</div>
							</div>
							<div class="form-group">
								<label class="col-md-2 control-label">確認密碼</label>
								<div class="col-md-9">
									<input type="password" class="form-control" id="register_password2" onblur="check_pwd2()" placeholder="請再一次輸入您的密碼" />
									<div id="pwd2_error" class="register_error" style="display: none; height: 10px; color: red;"></div>
								</div>
							</div>
							<div class="form-group">
								<label class="col-md-2 control-label">郵箱</label>
								<div class="col-md-9">
									<div class="input-group">
										<input type="email" class="form-control" data-register="register" id="register_email" onblur="check_email()" placeholder="請輸入您的郵箱" />
										<span class="input-group-addon" value="@mail.foxconn.com">@mail.foxconn.com</span>
									</div>
									<div id="email_error" class="register_error" style="display: none; height: 10px; color: red;"></div>
								</div>
							</div>
						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">關閉</button>
						<button type="button" class="btn btn-primary" id="register_btn">註冊</button>
					</div>
				</div>
			</div>
		</div>
		
		<div class="main" style="margin-bottom: 20px;">
	        <div class="demo">
	            <h3>素材上傳</h3>
	            <div class="span_set" style="width: 100%;min-height: 130px;">
	            	<h4>添加標籤</h4>
	            	<div class="col-md-10" style="height: 120px; border: 1px solid #E5E5E5;padding: 0px 5px;">
	            		<ul class="span_show" style="padding: 6px 0;">
	            			
	            		</ul>
	            	</div>
	            	<div class="col-md-2" style="padding: 3px;">
	            		<input type="text" id="picture_title" class="form-control" placeholder="請給素材添加標題" />
	            	</div>
	            	<div class="col-md-2" style="padding: 3px;">
	            		<select type="select" id="fodder_style" class="chosen-select form-control" data-placeholder="請選擇素材類型" style="width: 100%;color: #9999999;">
	            			<option value=""  style="display: none;">請選擇素材類型</option>
	            			<option value="高清圖片" value1="image">高清圖片</option>
	            			<option value="logo" value1="image">logo</option>
	            			<option value="矢量圖標" value1="image">矢量圖標</option>
	            			<option value="psd,gif,jpg,jpeg,png,gif,jpg,png,bmp" value1="psd">PSD素材</option>
	            			<option value="3ds,max,mtl,obj,dwg,lwo,vrml,gif,jpg,jpeg,png,gif,jpg,png,bmp" value1="3d">3D模型</option>
	            		</select>
	            	</div>
	            	<div class="input-group col-md-2" style="padding: 3px;">
	            		<div class="">
	            			<input type="text" id="span_value" class="form-control" placeholder="請設定相關標籤" style="border-top-left-radius: 4px; border-bottom-left-radius: 4px;" />
	            		</div>
	            		<span class="input-group-btn">
	            			<button class="btn btn-success" id="add_span" type="button">添加</button>
	            		</span>
	            	</div>
	            </div>
	            <div id="uploader" style="margin-top: 20px;">
	                 <input  name="beacon" class="file-loading" id="luoshurong" type="file" multiple="true" data-show-upload="false" data-preview-file-type="any" />
	            </div>
	            <div style="margin-top: 10px; text-align: center;">
	            	<button class="btn btn-lg btn-success" id="uploader_fileinput">上传文件</button>
	            </div>
	            
	        </div>
		</div>
		<!--<div class="container foot" style="position: fixed;z-index: 2;"></div>-->
		<div class="container foot" style="position: fixed;z-index: 2;"></div>
		<input class="hidden" id="span_array" value="" />
	</body>
	
	<script type="text/javascript" src="{% static 'js/jquery-2.2.0.min.js' %}" ></script>
	<script type="text/javascript" src="{% static 'bootstrap-3.3.7-dist/js/bootstrap.js' %}"></script>
	<script type="text/javascript" src="{% static 'js/Login.js' %}"></script>
	<script type="text/javascript" src="{% static 'js/webuploader.js' %}"></script>
	
	<script type="text/javascript" src="{% static 'bootstrap-fileinput-master/js/fileinput.js' %}"></script>
    <script type="text/javascript" src="{% static 'js/uploadfileinput.js' %}"></script>
</html>


















